<template>
  <el-dialog
    v-model="dialogVisible"
    :title="dialogTitle"
    width="600px"
    @close="closeDialog"
  >
    <el-form ref="formRef" label-width="120px" :model="form" :rules="rules">
      <el-form-item label="用户编码" prop="userid">
        <el-input v-model.trim="form.userid" :readonly="baseRecord" />
      </el-form-item>
      <el-form-item label="用户名称" prop="name">
        <el-input v-model.trim="form.name" />
      </el-form-item>
      <el-form-item v-if="!baseRecord" label="用户密码" prop="password">
        <el-input v-model.trim="form.password" />
      </el-form-item>
      <el-form-item v-if="!baseRecord" label="确认密码" prop="passwordConfirm">
        <el-input v-model.trim="form.passwordConfirm" />
      </el-form-item>
      <el-form-item label="用户电话" prop="mobile">
        <el-input v-model.trim="form.mobile" />
      </el-form-item>
      <el-form-item label="用户邮箱" prop="email">
        <el-input v-model.trim="form.email" />
      </el-form-item>
      <el-form-item label="地址" prop="address">
        <el-input v-model.trim="form.address" />
      </el-form-item>
      <el-form-item label="是否管理员" prop="isadmin">
        <el-select
          v-model="form.isadmin"
          clearable
          placeholder="请选择是否管理员"
        >
          <el-option :key="1" label="是" :value="1" />
          <el-option :key="0" label="否" :value="0" />
        </el-select>
      </el-form-item>
    </el-form>

    <template #footer>
      <el-button @click="closeDialog">取 消</el-button>
      <el-button type="primary" @click="save">确 定</el-button>
    </template>
  </el-dialog>
</template>
<script setup>
  import { ref } from 'vue'
  import { addUserApi, updateUserApi } from '@/api/comdesk/user'
  const $baseLoading = inject('$baseLoading')
  const $baseMessage = inject('$baseMessage')
  const dialogVisible = ref(false),
    dialogTitle = ref('增加用户'),
    formRef = ref(),
    form = reactive({}),
    rules = reactive({
      userid: [{ required: true, trigger: 'blur', message: '请输入用户编码' }],
      name: [{ required: true, trigger: 'blur', message: '请输入用户名称' }],
      password: [
        {
          required: true,
          trigger: 'blur',
          message: '请输入用户密码',
        },
      ],
      passwordConfirm: [
        {
          validator: (rule, value, callback) => {
            if (!value) {
              callback(new Error('请再次输入确认密码'))
            } else if (value !== form.password) {
              callback(new Error('两次密码不一致'))
            } else {
              callback()
            }
          },
          trigger: 'blur',
        },
      ],
    })

  let baseRecord = ref(null)

  const openDialog = (record) => {
    dialogVisible.value = true
    if (record.pkUser) {
      dialogTitle.value = '修改用户'
      baseRecord.value = record
      form['isadmin'] = record.isadmin ? record.isadmin : 0
      form['userid'] = record.userid ? record.userid : ''
      form['name'] = record.name ? record.name : ''
      form['address'] = record.address ? record.address : ''
      form['mobile'] = record.mobile ? record.mobile : ''
      form['email'] = record.email ? record.email : ''
      form['pkUser'] = record.pkUser ? record.pkUser : ''
    } else {
      dialogTitle.value = '增加用户'
      form['isadmin'] = 0
      form['userid'] = ''
      form['name'] = ''
      form['password'] = ''
      form['passwordConfirm'] = ''
      form['address'] = ''
      form['mobile'] = ''
      form['email'] = ''
      form['pkDept'] = record.pkDept
    }
  }
  const save = () => {
    if (!formRef.value) return
    formRef.value.validate(async (valid) => {
      if (valid) {
        let res = null,
          load = $baseLoading()
        if (baseRecord.value) {
          res = await updateUserApi({
            pkUser: baseRecord.value.pkUser,
            ...form,
          })
        } else {
          res = await addUserApi({
            ...form,
          })
        }
        load.close()
        if (res && res.code === 2000) {
          $baseMessage('操作成功', 'success')
          _emit('success-callback')
          closeDialog()
        } else {
          $baseMessage(res && res.msg ? res.msg : '操作失败,请重试', 'error')
        }
      } else {
        return false
      }
    })
  }
  const closeDialog = () => {
    baseRecord.value = null
    dialogVisible.value = false
  }
  defineExpose({ openDialog })
  const _emit = defineEmits(['success-callback'])
</script>
